<template>
    <div class="index-subtit">
        <h3>{{title}}</h3>
        <div class="right-slot">
            <slot name="titletentbox"></slot>
        </div>
    </div>
</template>

<script>
export default {
    name: 'titleslotcontent',
    /* 外部引入的值 */
    props: {
        title:{
            type: String,
            default: '内容框组件'
        },
        imgUrl:{
            type: String,
            default: '../'
        },
        width:{
            type: String,
            default: '500px'
        },
        height:{
            type: String,
            default: '600px'
        },
    },
    data() {
        return {

        }
    },
    mounted() {

    },
    methods: {

    },
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss" scoped>
    .index-subtit {
        position: relative;
        margin: 25px 0 20px;
        h3 {
            font-size: 24px;
            color: #fff;
            font-weight: normal;
            // background: url("../assets/images/index/subtit-icon.png") no-repeat
            // 0% 50%;
            padding-left: 35px;
            letter-spacing: 2px;
        }
        .right-slot {
            position: absolute;
            right: 0;
            top: 50%;
            transform: translateY(-50%);
        }
    }
</style>
